<template>
<view>
<!--team_detail.wxml-->
<view class="goods">
    <navigator class="goods-pic">
        <image class="wh100" :src="url + '/api/goods/goodsThumImages?goods_id=' + team.goods_id + '&width=400&height=400'"></image>
    </navigator>
    <view class="goods-cont">
        <view class="goods-name" url="url">{{team.goods_name}}</view>
        <view class="goods-num">{{teamFound.join}}人拼单·已拼{{team.virtual_sale_num}}件</view>
        <view class="goods-price"><text>￥{{teamFound.price}}</text>省{{teamFound.cut_price}}元</view>
    </view>
</view>
<view class="service">
    <view>
        <image src="/static/images/ico-check-red1.png"></image>
        {{shipping}}
    </view>
    <view v-if="back_time > 0">
        <image src="/static/images/ico-check-red1.png"></image>
        {{back_time}}天退货
    </view>
    <view>
        <image src="/static/images/ico-check-red1.png"></image>
        成团后48小时内发货
    </view>
    <view>
        <image src="/static/images/ico-check-red1.png"></image>
        假一赔十
    </view>
</view>
<view class="team">
    <view class="team-list">
        <view class="master">
            <view class="team-pic">
                <image class="wh100" :src="head_pic"></image>
            </view>
            <view class="team-master">拼主</view>
        </view>
        <block v-for="(item, index) in teamFollow" :key="index">
            <view class="team-pic">
                <image class="wh100" :src="item.follow_user_head_pic ? item.follow_user_head_pic : '../../../images/pic-member1.png'"></image>
            </view>
        </block>
    </view>
    <view v-if="teamFound.status == 1" class="team-num">仅剩 <text class="co-red">{{teamFound.surplus}}</text> 个名额，<text class="timer">{{teamFound.remainTime.hour}}:{{teamFound.remainTime.minute}}:{{teamFound.remainTime.second}}</text> 后结束</view>
    <view v-if="teamFound.status != 1" class="team-full team-num">
        <icon type="info" color="#ffab33" size="20"></icon>{{teamMsg.msg}}
    </view>
    <button v-if="status == 1" class="join-groups" open-type="share">{{teamMsg.btnTxt}}</button>
    <navigator v-if="status == 2 || status == 4 || status==5" class="join-groups">{{teamMsg.btnTxt}}</navigator>
    <navigator v-if="status == 0 ||status == 3" class="join-groups" @tap="openSpecModel">{{teamMsg.btnTxt}}</navigator>
    <navigator v-if="team.team_type == 2" class="join-groups" style="background-color:#EDEDED" :url="'../../team/team_sweepstakes/team_sweepstakes?team_id=' + team.team_id">{{team.is_lottery == 1 ? '查看中奖名单' : '未开奖'}}</navigator> 
    <!-- <view wx:if="{{teamFound.status != 1 }}" class="team-full team-num">
        <icon type="info" color="#ffab33" size="20" />{{teamMsg.msg}}
    </view>
    <navigator class="join-groups" bindtap="openSpecModel">{{teamMsg.btnTxt}}</navigator>
    <navigator wx:if="{{team.team_type == 2}}" class="join-groups" style="background-color:#EDEDED" url="../../team/team_sweepstakes/team_sweepstakes?team_id={{team.team_id}}">{{team.is_lottery == 1 ? '查看中奖名单' : '未开奖'}}</navigator> -->
</view>
<view class="team-tips">
    <text>拼单须知</text>
    <text class="team-des">好友拼单 · 人满发货 · 人不满退货</text>
</view>
<view class="nav">
    <navigator url="/pages/index/index/index">
        <image src="/static/images/pic-sy.png"></image>
        <view>首页</view>
    </navigator>
    <navigator url="/pages/activity/seckill_list/seckill_list">
        <image src="/static/images/pic-ms.png"></image>
        <view>秒杀</view>
    </navigator>
    <navigator>
        <image src="/static/images/pic-qc.png"></image>
        <view>清仓</view>
    </navigator>
    <navigator url="/pages/activity/group_list/group_list">
        <image src="/static/images/pic-tg.png"></image>
        <view>团购</view>
    </navigator>
</view>
<view class="goods-list">
    <navigator v-for="(item, index) in teamGoods" :key="index" :url="'/pages/team/team_info/team_info?goods_id=' + item.goods_id + '&item_id=' + item.item_id + '&team_id=' + item.team_id">
        <image :src="url + '/api/goods/goodsThumImages?goods_id=' + item.goods_id + '&width=400&height=400'"></image>
        <view class="item-goods-name ellipsis-2">{{item.goods_name}}</view>
        <view class="item-goods-num">
            <text class="co-red">￥{{item.team_price}}</text>
            <text>已拼{{item.sales_sum + item.virtual_num}}件</text>
        </view>
    </navigator>
</view>

<!-- 规格弹框  -->
<!-- <view hidden="{{!openSpecModal}}">
    <view class="cover-layer" bindtap="closeSpecModal"></view>
    <view class="spec-model">
        <icon type="cancel" color="gray" size="22" class="modal-close" bindtap="closeSpecModal"/>
        <view class="spec-goods">
            <image class="wh100 spec-img" src="{{url}}/api/goods/goodsThumImages?goods_id={{team.goods_id}}&width=200&height=200"></image>
            <view class="spec-goods-info">
                <view class="spec-goods-name">{{team.goods_name}}</view>
                <view class="spec-goods-price">￥ {{team.team_price}}</view>
                <view class="spec-goods-stock">剩余库存：{{team.store_count}}</view>
            </view>
        </view>
        <view class="spec-name">数量</view>
        <view class="count">
            <view class="sub" bindtap="subCartNum">-</view>
            <input type="number" value="{{goodsInputNum}}" bindblur="inputCartNum"/>
            <view class="add" bindtap="addCartNum">+</view>
        </view>
        <view class="spec-cart-btn {{team.store_count <= 0 ? 'spec-cart-disable':''}}" bindtap="buyNow">立即购买</view>
    </view>
</view> -->




<!-- 规格弹框  -->
<view :hidden="!openSpecModal">
    <view class="cover-layer" @tap="closeSpecModal"></view>
    <view class="spec-model">
        <icon type="cancel" color="gray" size="22" class="modal-close" @tap="closeSpecModal"></icon>
        <view class="spec-goods">
            <image class="wh100 spec-img" :src="url + '/api/goods/goodsThumImages?goods_id=' + team.goods.goods_id + '&width=200&height=200'"></image>
            <view class="spec-goods-info">
                <view class="spec-goods-name">{{goods.goods_name}}</view>     
                  <view v-if="select.prom_id > 0" class="spec-goods-price">￥ {{select.teamPrice}}({{select.needer}}人团){{select.statusDesc}}</view> 
                <view v-else class="spec-goods-price">￥ {{select.price}}</view>
                <view class="spec-goods-stock">剩余库存：{{select.stock}}</view>
            </view>
        </view>
        <view class="spec-name">数量</view>
        <view class="count">
            <view class="sub" @tap.stop="subCartNum">-</view>
            <input type="number" :value="goodsInputNum" @blur="inputCartNum"></input>
            <view class="add" @tap.stop="addCartNum">+</view>
        </view>
        <block v-for="(item, listIdx) in team.goods.spec" :key="listIdx">
            <view class="spec-name">{{item.spec_name}}</view>
            <view class="spec-wrap">
                <view v-for="(spec, index) in item.spec_item" :key="index" :class="'spec-btn ' + (item.selectItemId==spec.id?'spec-btn-click':'')" @tap.stop="selectSpec" :data-listidx="listIdx" :data-itemid="spec.id">{{spec.item}}</view>
            </view> 
        </block>
        <view :class="'spec-cart-btn ' + (select.prom_id<=0||select.stock<=0 ? 'spec-cart-disable':'')" @tap.stop="buyNow">立即购买</view>
    </view>
</view>
</view>
</template>

<script>
1; // team_detail.js
// team_detail.js
var app = getApp();
var request = app.globalData.request;
var setting = app.globalData.setting;
var util = require("../../../utils/util.js");
var common = require("../../../utils/common.js");
import LoadMore from "../../../utils/LoadMore";
var load = new LoadMore();

export default {
  data() {
    return {
      url: setting.url,
      defaultAvatar: setting.resourceUrl + "/static/static/images/user68.jpg",
      openSpecModal: false,
      //是否打开规格弹窗
      foundId: 0,
      team: null,
      order_id: 0,
      goods_id: 0,
      teamFollow: null,
      teamFound: null,
      serverTime: 0,
      teamGoods: [],
      head_pic: null,
      teamMsg: {
        msg: '',
        btnTxt: ''
      },
      timer: null,
      goodsInputNum: 1,
      currentPage: 1,
      back_time: 0,
      shipping: '包邮',
      optionItemId: 0,
      //页面参数，页面初始化指定显示的itemid，用于活动
      select: {
        //选择的(规格)商品的参数，用于显示
        teamId: 0,
        teamPrice: 0,
        needer: 0,
        price: 0,
        stock: 0,
        statusDesc: '',
        shareDesc: ''
      },
      specSelect: 0,
      //选中的组合规格数组spec_goods_price下标
      status: 0
    };
  },

  components: {},
  props: {},
  onLoad: function (options) {
    console.log(options); //以前有登录过，则直接登录

    if (app.globalData.auth.hadAuth()) {
      app.globalData.getUserInfo();
    }

    var that = this;
    load.init(this, '', 'teamGoods');
    var foundId = typeof options.foundId == 'undefined' ? 0 : options.foundId;
    var order_id = typeof options.order_id == 'undefined' ? 0 : options.order_id;
    that.setData({
      foundId: foundId,
      order_id: order_id
    });
    that.getTeamGoods();
    that.getTeamGoodlist(); //获取可申请售后时间上限

    app.globalData.getConfig(function (res) {
      var back_time = common.getConfigByName(res.config, 'auto_service_date');
      that.setData({
        back_time: back_time
      });
    }); //获取是否包邮信息
    // console.log(that.data.goods_id);
    // that.getUserAddress(that.data.goods_id);
  },

  /**
   * 转发按钮
   */
  onShareAppMessage: function (res) {
    var that = this;
    var team = that.team;
    var url = that.url;
    return {
      title: team.share_title ? team.share_title : team.goods.goods_name,
      //自定义转发标题
      path: '/pages/team/team_detail/team_detail?order_id=' + that.order_id + '&foundId=' + that.teamFound.found_id + '&first_leader=' + uni.getStorageSync('app:userInfo')['user_id'],
      imageUrl: team.share_img ? url + team.share_img : team.goods.original_img ? url + team.goods.original_img : team.goods.spec_goods_price[0].spec_img ? url + team.goods.spec_goods_price[0].spec_img : ''
    };
  },
  onShow: function () {
    if (uni.getStorageSync('team_info_login')) {
      uni.removeStorageSync('team_info_login');
      clearInterval(this.timer);
      this.getTeamGoods();
    }
  },
  onUnload: function () {
    clearInterval(this.timer);
  },
  onPullDownRefresh: function () {
    this.reloadGoodList();
  },
  onReachBottom: function () {
    if (load.canloadMore()) {
      this.getTeamGoodlist();
    }
  },
  methods: {
    /** 获取用户地址 */
    getUserAddress: function (goods_id) {
      var that = this;
      var consigneeAddress = uni.getStorageSync('goodsInfo:goodsInfo:address');

      if (consigneeAddress) {
        that.refreshDispatch(goods_id, consigneeAddress);
      } else {
        request.post('/api/goods/getDefaultAddress', {
          data: {
            goods_id: goods_id
          },
          success: function (res) {
            that.refreshDispatch(goods_id, res.data.result);
          }
        });
      }
    },

    /**查询商品物流 */
    refreshDispatch: function (goods_id, consigneeAddress) {
      var that = this;
      request.get('/api/team/checkFreeShipping', {
        data: {
          goods_id: goods_id,
          region_id: consigneeAddress.district
        },
        success: function (res) {
          var shippinginfo;

          if (res.data.result == 1) {
            shippinginfo = '不包邮';
          } else if (res.data.result == 0) {
            shippinginfo = '包邮';
          } else if (res.data.result > 0) {
            shippinginfo = '￥' + res.data.result;
          } else {
            shippinginfo = res.data.msg;
          }

          that.setData({
            shipping: shippinginfo
          });
        }
      });
    },
    getTeamGoods: function () {
      var that = this;
      request.get('/api/Team/found', {
        data: {
          id: that.foundId,
          order_id: that.order_id
        },
        failRollback: true,
        success: function (res) {
          that.setData({
            goods_id: res.data.result.team.goods_id
          });
          var result = res.data.result;
          var head_pic = result.teamFound.head_pic;

          if (head_pic && head_pic.indexOf("http") == -1) {
            head_pic = that.url + head_pic;
          }

          var teamFollow = result.teamFollow;

          for (var i = 0; i < teamFollow.length; i++) {
            if (teamFollow[i].follow_user_head_pic && teamFollow[i].follow_user_head_pic.indexOf("http") == 0) {
              //teamFollow[i].follow_user_head_pic = that.data.url + teamFollow[i].follow_user_head_pic;
              teamFollow[i].follow_user_head_pic = teamFollow[i].follow_user_head_pic;
            } else {
              teamFollow[i].follow_user_head_pic = that.defaultAvatar;
            }
          }

          if (teamFollow.length < result.teamFound.need - 1) {
            var need = result.teamFound.need - 1 - teamFollow.length;

            for (var i = 0; i < need; i++) {
              var follow = {
                follow_user_head_pic: ''
              };
              teamFollow.push(follow);
            }
          }

          result.teamFound.cut_price = result.teamFound.cut_price.toFixed(2);
          that.setData({
            serverTime: result.server_time,
            team: result.team,
            teamFollow: teamFollow,
            teamFound: result.teamFound,
            head_pic: head_pic
          });

          if (result.teamFound.status == 0) {
            that.setData({
              'teamMsg.msg': "待开团",
              'teamMsg.btnTxt': "一键发起拼单"
            });
          } else if (result.teamFound.status == 1) {
            var user_id = app.globalData.userInfo ? app.globalData.userInfo.user_id : 0;

            if (result.teamFound.user_id == user_id) {
              that.setData({
                'status': 1,
                'teamMsg.msg': '',
                'teamMsg.btnTxt': "邀请好友拼单"
              });
            } else {
              //参与拼团
              var is_play = false;

              for (var i = 0; i < result.teamFollow.length; i++) {
                if (result.teamFollow[i].follow_user_id == user_id) {
                  is_play = true;
                }
              }

              if (is_play) {
                that.setData({
                  'status': 2,
                  'teamMsg.msg': '',
                  'teamMsg.btnTxt': "您已参与拼单"
                });
              } else {
                that.setData({
                  'status': 3,
                  'teamMsg.msg': '参与拼单',
                  'teamMsg.btnTxt': "参与拼单"
                });
              }
            }

            that.createTimer();
          } else if (result.teamFound.status == 2) {
            that.setData({
              'status': 4,
              'teamMsg.msg': "拼单已满",
              'teamMsg.btnTxt': "拼单完成"
            });
          } else {
            that.setData({
              'status': 5,
              'teamMsg.msg': "拼单失败",
              'teamMsg.btnTxt': "一键发起拼单"
            });
          } //初始化选择的规格


          that.initSpecsPrice();
          that.getUserAddress(that.goods_id);
        }
      });
    },

    /** 检查购买的数量 */
    checkCartNum: function (num) {
      var stock = this.team.goods.store_count;

      if (this.team.goods.spec_goods_price.length > 0) {
        stock = this.team.goods.spec_goods_price[this.specSelect].store_count;
      }

      if (num > stock || stock == 0) {
        num = stock;
      } else if (num < 1) {
        num = 1;
      }

      this.setData({
        goodsInputNum: num
      });
    },
    createTimer: function () {
      var that = this;
      var startTime = new Date().getTime();
      this.timer = setInterval(function () {
        var teamFound = that.teamFound;
        var diffTime = startTime - that.serverTime * 1000;
        teamFound.remainTime = util.transTime(teamFound.found_end_time * 1000 - new Date().getTime() + diffTime);

        if (teamFound.remainTime.hour < 0) {
          clearInterval(that.timer);
          that.getTeamGoods();
        }

        that.setData({
          teamFound: teamFound
        });
      }, 1000);
    },
    getTeamGoodlist: function () {
      var that = this;
      var requestUrl = app.globalData.setting.url + '/api/Team/ajaxGetMore?p=' + that.currentPage;
      uni.request({
        url: requestUrl,
        header: {
          'content-type': 'application/json'
        },
        success: function (res) {
          if (res.data.status != 0) {
            that.currentPage++;
            var new_team_goods = that.teamGoods;

            for (var t = 0; t < res.data.result.length; t++) {
              new_team_goods.push(res.data.result[t]);
            }

            that.setData({
              teamGoods: new_team_goods
            });
            uni.stopPullDownRefresh();
          }
        }
      }); // load.request(requestUrl, function(res) { 
      //   that.data.currentPage++;
      //   wx.stopPullDownRefresh();
      // });
    },
    //重置数据
    reloadGoodList: function () {
      load.resetConfig();
      this.teamGoods = null;
      this.currentPage = 1;
      this.getTeamGoodlist();
    },

    /** 关闭规格弹窗 */
    closeSpecModal: function () {
      this.setData({
        openSpecModal: false
      });
    },

    /** 打开规格弹窗 */
    openSpecModel: function () {
      this.setData({
        openSpecModal: true
      });
    },

    /** 增加购买的商品数量 */
    addCartNum: function (e) {
      var num = this.goodsInputNum + 1;
      this.checkCartNum(num);
    },

    /** 减少购买的商品数量 */
    subCartNum: function (e) {
      var num = this.goodsInputNum - 1;

      if (num < 1) {
        num = 1;
      }

      this.checkCartNum(num);
    },

    /** 输入购买的数量 */
    inputCartNum: function (e) {
      var num = Number(e.detail.value);
      this.checkCartNum(num);
    },

    /** 立即购买 */
    buyNow: function () {
      //检查用户是否登录方可操作立即购买
      if (!app.globalData.auth.isAuth()) {
        this.setData({
          openSpecModal: !this.openSpecModal
        });
        uni.setStorageSync('team_info_login', true);
        app.globalData.showLoading(null, 1500);
        app.globalData.getUserInfo();
        return;
      }

      var that = this;
      var data = that.team;
      var data = {
        item_id: data.goods.spec_goods_price.length > 0 ? data.goods.spec_goods_price[that.specSelect].item_id : '',
        goods_id: data.goods.goods_id,
        goods_num: that.goodsInputNum,
        found_id: that.teamFound.status == 1 ? that.foundId : ''
      };
      request.get('/api/Team/addOrder', {
        data: data,
        success: function (res) {
          var result = res.data.result;
          uni.navigateTo({
            url: '/pages/team/team_confirm/team_confirm?orderSn=' + res.data.result.order_sn + '&found_id=' + that.foundId
          });
        }
      });
    },

    /** 初始化所有规格 */
    initSpecsPrice: function () {
      var specSelect = 0; //初始化选中第一个规格

      var specs = this.team.goods.spec_goods_price;
      var team_activity = this.team;

      if (specs.length == 0) {
        //没有规格
        this.setData({
          'select.prom_id': team_activity.team_goods_item[0].team_id,
          'select.teamPrice': team_activity.team_goods_item[0].team_price,
          'select.price': team_activity.team_goods_item[0].price ? team_activity.team_goods_item[0].price : team_activity.goods.shop_price,
          'select.stock': team_activity.team_goods_item[0].store_count ? team_activity.team_goods_item.store_count : team_activity.goods.store_count,
          'select.needer': team_activity.needer
        });
        return;
      }

      if (this.optionItemId) {
        //指定规格
        for (var i = 0; i < specs.length; i++) {
          if (specs[i].item_id == this.optionItemId) {
            specSelect = i;
            break;
          }
        }
      } else {
        //选取当前参与拼团活动的商品进行显示
        for (var i = 0; i < specs.length; i++) {
          if (specs[i].prom_type == 6) {
            specSelect = i;
            break;
          }
        }
      } //生成子规格组(spec)的各自选中项


      var specIds = specs[specSelect].key.split("_");
      var list = team_activity.goods.spec;

      for (var i = 0; i < list.length; i++) {
        for (var j = 0; j < list[i].spec_item.length; j++) {
          if (util.inArray(list[i].spec_item[j].id, specIds)) {
            list[i].selectItemId = list[i].spec_item[j].id;
            break;
          }
        }
      }

      this.setData({
        specSelect: specSelect,
        'team.goods.spec': list,
        'team.goods.spec_goods_price': specs
      });
      this.initSelectSpecGoods(specs[specSelect]['item_id']);
    },

    /** 检查规格商品 */
    initSelectSpecGoods: function (item_id) {
      var that = this;
      request.post('/api/Team/ajaxCheckTeam', {
        data: {
          goods_id: that.team.goods.goods_id,
          item_id: item_id
        },
        successReload: true,
        success: function (res) {
          that.initActivity(res.data);
        }
      });
    },

    /** 初始化选中的规格商品 */
    initActivity: function (data) {
      var that = this;

      if (data.status == 1) {
        var datas = data.result.team_goods_item;
        that.setData({
          'select.prom_id': datas.spec_goods_price.prom_id,
          'select.teamPrice': datas.team_price,
          'select.price': datas.spec_goods_price.price,
          'select.stock': datas.spec_goods_price.store_count,
          'select.needer': datas.team_activity.needer,
          'select.statusDesc': datas.team_activity.front_status_desc,
          'select.shareDesc': datas.team_activity.share_desc
        });
      } else {
        that.setData({
          'select.statusDesc': '未参与活动'
        });
      }
    },

    /** 点击规格按钮的回调函数 */
    selectSpec: function (e) {
      //对商品数量进行判断，对库存进行判断
      var itemId = e.currentTarget.dataset.itemid;
      var listIdx = e.currentTarget.dataset.listidx;
      var list = this.team.goods.spec;
      var team_activity = this.team;

      if (list[listIdx].selectItemId == itemId) {
        return;
      }

      list[listIdx].selectItemId = itemId;
      var newSpecKeys = [];

      for (var i = 0; i < list.length; i++) {
        newSpecKeys[i] = list[i].selectItemId;
      } //item排序,生成key


      var newSpecKeys = util.sortSize(newSpecKeys).join('_');
      var newSpecSelect = 0;
      var specs = this.team.goods.spec_goods_price;

      for (var i = 0; i < specs.length; i++) {
        if (specs[i].key == newSpecKeys) {
          newSpecSelect = i;
          break;
        }
      }

      this.setData({
        specSelect: newSpecSelect,
        'team.goods.spec': list,
        'team.goods.spec_goods_price': specs,
        optionItemId: specs[newSpecSelect].item_id
      });
      this.checkCartNum(this.goodsInputNum);
      this.initSelectSpecGoods(this.optionItemId);
    }
  }
};
</script>
<style>
/* team_detail.wxss */
.goods{
    display: flex;
    justify-content: space-between;
    padding: 16rpx 20rpx;
    background-color: #fff;
}

.goods-pic{
    width: 258rpx;
    height: 258rpx; 
}
.goods-name{
    width: 420rpx;
    color: #555;
    font-size: 30rpx;
    line-height: 38rpx;
    max-height: 152rpx;
    overflow: hidden;
}
.goods-num{
    margin-top: 12rpx;
    height:36rpx;
    line-height: 36rpx;
    font-size: 26rpx;
    color: #aaa;
    overflow: hidden;
}
.goods-price{
    margin-top: 12rpx;
    height: 30rpx;
    line-height: 30rpx;
    font-size: 26rpx;
    color: #888;
    overflow: hidden;
}
.goods-price>text{
    color:#ff6a00;
    font-size: 30rpx;
    font-weight: bold;
    margin-right: 16rpx; 
}
.service{
    height: 24rpx;
    padding: 24rpx 0;
    display: flex;
    justify-content: space-around;
    font-size: 24rpx;
    line-height: 1;
    color: #888;
}
.service image{
    width: 24rpx;
    height: 24rpx;
    vertical-align: top;
}
.team{
    background: #fff;
    padding:30rpx 0 10rpx;  
    border-bottom: 2rpx solid #f3f3f3;
}
.team-list{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    padding-top:20rpx;
    max-height: 176rpx;
    overflow: hidden; 
}
.team-list>view{
    margin: 0 10rpx;
}
.team-pic{
    width: 88rpx;
    height: 88rpx;
    border-radius: 50%;
    overflow: hidden;
}
.master{
    position: relative;
    width: 80rpx;
    height: 80rpx;
    border:4rpx solid #ffab33;
    border-radius: 50%;
}
.master .team-pic{
   width: 80rpx;
   height: 80rpx;
}
.team-master{
    position: absolute;
    top: -10rpx;
    left: -10rpx;
    background-color:#ffab33;
    font-size: 22rpx;
    line-height: 28rpx;
    padding: 0 10rpx;
    border-radius: 14rpx;
    color: #fff;
}
.team-num{
    margin:24rpx 0 12rpx; 
    text-align: center;
    font-size: 30rpx;
    line-height:48rpx;
    color: #555;
}
.timer{
    font-weight: bold;
    color: #000;
}
.team-full>icon{
    vertical-align: top;
}
.join-groups{
    margin: 0 auto 30rpx;
    width: 700rpx;
    line-height: 84rpx;
    font-size: 36rpx;
    color: #fff;
    text-align: center;
    background-color: #e02e24;
    border-radius: 12rpx;
}
.team-tips{
    display: flex;
    justify-content: space-between;
    padding: 0 30rpx;
    line-height: 84rpx;
    font-size: 24rpx;
    background-color: #fff;
    color: #555;
}
.team-des{
    color: #888;
}
.nav{
    display: flex;
    margin-top: 12rpx;
    height: 100rpx;
    padding: 22rpx 0 14rpx;
    background-color: #fff;
}
.nav>navigator{
    width: 25%;
    text-align: center;
}
.nav image{
    width: 50rpx;
    height: 50rpx;
}
.nav view{
    font-size: 30rpx;
    line-height:34rpx;
    color: #555;
}
.goods-list{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.goods-list>navigator{
    margin-top:4rpx; 
    width: 373rpx;
    background-color: #fff;
}
.goods-list image{
    width: 373rpx;
    height: 373rpx;
}
.item-goods-name{
    margin:8rpx 0;
    padding:0 16rpx;
    font-size:30rpx;
    height:84rpx; 
    line-height:42rpx;
    color: #555;
}
.item-goods-num{
    display:flex;
    justify-content: space-between;
    padding:0 16rpx;
    line-height: 48rpx;
    padding-bottom: 18rpx;
    font-size: 24rpx;
    color: #888;
}
.item-goods-num .co-red{
    font-size: 30rpx;
    font-weight: bold;
}
/* 规格弹框 */
.spec-model{
    position: fixed;
    bottom: 0;
    z-index: 999;
    background: white;
    width: 100%;
    padding: 0 30rpx;
    font-size: 32rpx;
    box-sizing: border-box;
    overflow-x: hidden;
}
.spec-goods{
    padding: 15rpx 0 30rpx;
    float: left;
    width: 100%;
    border-bottom: 1px solid #f3f3f3;
}
.spec-img{
    float: left;
    height: 150rpx;
    width: 150rpx;
    margin-top:16rpx;
}
.spec-goods-info{
    float: left;
    padding: 0 25rpx; 
    width: 490rpx;
}
.spec-goods-name{
    font-size: 30rpx;
    line-height: 35rpx;
    max-height: 70rpx;
    margin: 15rpx 20rpx 20rpx 0;
    overflow: hidden;
    text-overflow: ellipsis;
}
.spec-goods-price{
    color: #ff6a00;
    font-size: 30rpx;
    font-weight: bold;
}
.spec-goods-stock{
    margin-top: 10rpx;
    font-size: 26rpx;
    color: #999999;
}
.spec-name{
    clear: both;
    padding: 20rpx 0;
    font-size: 30rpx;
}
.count{
    width: 184rpx;
    height: 50rpx;
    border: 1rpx solid #f3f3f3;
    font-size: 28rpx;
}
.count>view,.count>input{
    float: left;
    width: 60rpx;
    height: 50rpx;
    line-height: 50rpx;
    text-align: center;
}
.sub{
    border-right: 1px solid #f3f3f3;
}
.add{
    border-left: 1px solid #f3f3f3;
}
.spec-cart-btn{
    margin:120rpx 0 0 -30rpx;
    padding: 30rpx;
    width: 100%;
    font-size: 30rpx;
    text-align: center;
    color: #fff;
    background-color: #ff6a00;
}
.spec-add-cart{
    background-color: #ffb03f;
}
.spec-buy{
    background-color: #ff6a00;
    margin-left: 34rpx;
}
.spec-cart-disable{
    background: #bbbbbb;
}
.spec-cart-btn-lg{
    width: 614rpx;
}
.spec-btn{
    color: black;
    background-color: white;
    padding: 10rpx 10rpx;
    font-size: 26rpx;
    line-height: 28rpx;
    float: left;
    border: 1rpx solid #f3f3f3;
    margin: 4rpx 10rpx 4rpx 0;
    border-radius: 4rpx;
}
.spec-btn-click{
    color: white;
    background-color: #ff6a00;
    border: 1rpx solid #ff6a00;
}
</style>